<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core">

<ui:composition template="../templates/template.xhtml">

	<ui:define name="title">
	 	Add User
	</ui:define>

	<ui:param name="page" value="addUser" />

	<ui:define name="header">
		<ui:include src="/secure/header.xhtml" />
	</ui:define>

	<ui:define name="menu">
		<div align="center">
			<h:form id="mennuForm" >
			<br />
			<br />
			<h:commandButton value="Back" action="#{addUser.back}" styleClass="buttonClass" />
			<br />
			<br />
			</h:form>
		</div>
	</ui:define>

	<ui:define name="body">
		<h:form>
			<br/> 
			<div id="bodypanel">
				<h:outputLabel value="Add New User"	styleClass="textFont200" /> 
				<br /> 
				<br />
						<h:panelGrid width="100%" columns="3" styleClass="iCubed">
							<f:facet name="header">
								User Details
							</f:facet>
							<h:column> 
								Username: 
							</h:column>
							<h:column>
								<h:inputText id="username" value="#{addUser.userId}" required="true"/>
							</h:column>
							<h:column>
								<h:message for="username" styleClass="error" />
							</h:column>
							<h:column> 
								First Name: 
							</h:column>
							<h:column>
								<h:inputText id="firstName" value="#{addUser.firstName}" required="true"/>
							</h:column>
							<h:column>
								<h:message for="firstName" styleClass="error" />
							</h:column>
							<h:column> 
								Last Name: 
							</h:column>
							<h:column>
								<h:inputText id="lastName" value="#{addUser.lastName}" required="true"/>
							</h:column>
							<h:column>
								<h:message for="lastName" styleClass="error" />
							</h:column>
						</h:panelGrid>
					
						 <h:panelGrid width="100%" styleClass="iCubed" columns="2" >
							<f:facet name="header">
								User Role(s)
							</f:facet>
							<h:column>								
								<h:selectManyListbox id="roles" binding="#{addUser.rolesSelect}" required="true" />
							</h:column>
							<h:column>
								<h:message for="roles" styleClass="error" />
							</h:column>
						</h:panelGrid>		
						
						<h:panelGrid  width="100%" styleClass="iCubed" columns="2"  >
							<f:facet name="header">
								Email Address :
							</f:facet>
							<h:column>
								<h:inputText id="email" value="#{addUser.email}" required="true" />
							</h:column>
							<h:column>
								<h:message for="email" styleClass="error" />	
							</h:column>		
						</h:panelGrid>				
				
						<h:panelGrid width="100%" styleClass="iCubed" columns="1"  >
							<f:facet name="header">
								User Organization(s)
							</f:facet>
							<h:column>
								<h:selectManyListbox id="organizations" binding="#{addUser.organizationsSelect}" required="true"/>
							</h:column>
							<h:column>
								<h:message for="organizations" styleClass="error" />	
							</h:column>							
						</h:panelGrid>						
			
						
				<br />
					<h:column> 
						<h:commandButton action="#{addUser.addUser}" value="Add User" styleClass="buttonClass"/> 
					</h:column>
						
		
				
				
			</div>
			<br />
		</h:form>
	</ui:define>

</ui:composition>

</html>
